﻿*{font-family: "微软雅黑";}
.demo{background: #ffded7;padding: 2em 0;}
a:hover,a:focus{outline: none;text-decoration: none;}
.tab .nav-tabs{padding-left: 15px;border-bottom: 4px solid #692f6c;}
.tab .nav-tabs li a{color: #fff;padding: 10px 20px;margin-right: 10px;background: #692f6c;text-shadow: 1px 1px 2px #000;border: none;border-radius: 0;opacity: 0.5;position: relative;transition: all 0.3s ease 0s;}
.tab .nav-tabs li a:hover{background: #692f6c;opacity: 0.8;}
.tab .nav-tabs li.active a{opacity: 1;}
.tab .nav-tabs li.active a,.tab .nav-tabs li.active a:hover,.tab .nav-tabs li.active a:focus{color: #fff;background: #692f6c;border: none;border-radius: 0;}
.tab .nav-tabs li a:before,.tab .nav-tabs li a:after{content: "";border-top: 42px solid transparent;position: absolute;top: -2px;}
.tab .nav-tabs li a:before{border-right: 15px solid #692f6c;left: -15px;}
.tab .nav-tabs li a:after{border-left: 15px solid #692f6c;right: -15px;}
.tab .nav-tabs li a i,.tab .nav-tabs li.active a i{display: inline-block;padding-right: 5px;font-size: 15px;text-shadow: none;}
.tab .nav-tabs li a span{display: inline-block;font-size: 14px;letter-spacing: -9px;opacity: 0;transition: all 0.3s ease 0s;}
.tab .nav-tabs li a:hover span,.tab .nav-tabs li.active a span{letter-spacing: 1px;opacity: 1;transition: all 0.3s ease 0s;}
.tab .tab-content{padding: 30px;background: #fff;font-size: 16px;color: #6c6c6c;line-height: 25px;}
.tab .tab-content h3{font-size: 24px;margin-top: 0;}
@media only screen and (max-width: 479px){.tab .nav-tabs li{width: 100%;margin-bottom: 5px;text-align: center;}
.tab .nav-tabs li a span{letter-spacing: 1px;opacity: 1;}}